body{
    background-color: #e6e6e6;
}
.banner{
    height: 25em;
    text-align: center;
    color: #ffffff;
    
    .back{
        position: absolute;
        top: 4.5em;
        left: 0;
        z-index: -100;
        height: 30em;
        img{
            width: 100%;
            height: 100%;

        }
    }
    .headling{
        font-size: 3em;
        font-family: OSLight;
        letter-spacing: 1px;
        margin-top: 3em;
    }
    .detext{
        font-size: 2em;
        font-family: OSBold;
        
    }
    .p1{
        width: 60%;
        margin:  auto;
        margin-top: 2em;
    }
    .p2{
        width: 55%;
        margin: 0 auto;
    }
    @media screen and (max-width:450px) {
        .p1,.p2{
            font-size: 11PX;
        }
    }
}

.team{
    width: 100%;
    height: 55em;
    .boxe{
        position: relative;
        width: 70%;
        height: 100%;
        margin: 0 auto;
        .box{
            position: absolute;
            width: 38%;
            top:-20px;
            
        }
        .box1{
            position: absolute;
            width: 58%;
            height: 50%;
            right: 20px;
            top: -30px;
            .boxback{
                background-color: #ffffff;
                height: 80%;
                overflow: hidden;
                overflow: auto;
                h4{
                    padding: 2em 1em 1em;
                    color: #333333;
                }
                p{
                    padding: 0em 2em 0em 2em;
                    font-size: 10px;
                    color: #666666;
                }
            }
        }
        .box2{
            position: absolute;
            width: 38%;
            right: -20px;
            top:17em;
            z-index: 100;
        }
        .box3{
            position: absolute;
            width: 58%;
            height: 50%;
            left: 7em;
            top: 21em;
            .boxback{
                background-color: #ffffff;
                height: 80%;
                overflow: hidden;
                overflow: auto;
                h4{
                    padding: 2em 1em 1em;
                    color: #333333;
                }
                p{
                    padding: 0em 8em 0em 2em;
                    font-size: 10px;
                    color: #666666;
                }
            }
        }
        .boxe1{
            position: relative;
            width: 50%;
            height: 100%;
            margin: 0 auto;
            .box4{
                position: absolute;
                width: 75%;
                right: 1px;
                bottom: 20px;
                z-index: 100;
            }
        }
    }
    @media screen and (max-width:1000px) {
        height: 50em;
        .boxe{
            .box{
                width: 45%;
                left: -20px;
            }
            .box1{
                width: 70%;
                right: -7em;
            }
            .box2{
                top: 20em;
                width: 45%;
                right: -5em;
            }
            .box3{
                width: 70%;
                left: 1px;
            }
            .boxe1{
                width: 60%;
                .box4{
                    right: -10em;
                    
                }
            }
        }
    }

    @media screen and (max-width:450px) {
        height: 100%;
        .boxe{
            position: static;
            width: 100%; 
            height: 100%;
            .box{
                position: static;
                width: 70%;
                margin: 2em auto;
                img{
                    border-radius: 20px;
                }
            }
            .box1{
                position: static;
                margin: 1em auto;
                width: 90%;
                .boxback{
                    border-radius: 20px;
                }
            }
            .box2{
                position: static;
                margin: 2em auto;
                width: 80%;
                img{
                    border-radius: 20px;
                }
            }
            .box3{
                position: static;
                margin: 1em auto;
                width: 90%;
                height: 40%;
                .boxback{
                    border-radius: 20px;
                }
            }
            .boxe1{
                width: 100%;
                .box4{
                    position: static;
                    margin: 2em auto;
                    img{
                        border-radius: 20px;
                    }
                }
            }
        }
    }
}

.footer{
    margin-top: 2em;
}